@import "./common/css/common.scss";
@import "./common/css/customeStyle.scss";

:root,page{
  --theme-color:#C80F2F;
  --theme-color-10:#C80F2F16;
  --sub-theme:#F65F25;
  --bg-color:#000;
  --page-bg:#f6f6f6;
  --title-color:#282828;
  --subT-color:#777A7F;
  --border-color: #e6e8ea;
}
.taro_router .taro_page{
  background-color: transparent!important;
}
.theme-color{
  color: var(--theme-color)!important;
}
.theme-bg-10{
  background: var(--theme-color-10)!important;
}
.sub-theme{
  color: var(--sub-theme)!important;
}

.at-nav-bar{
  background-color: transparent!important;
}
.btn-yellow {
  width: 682px;
  height: 92px;
  background: rgba(255, 220, 38, 1);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.h5-br{
  display: block;
}

.btn-yellow.disabled {
  opacity: 0.5;
}

.btn-blue {
  width: 682px;
  height: 92px;
  background: #313A97;
  border-radius: 10px;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-blueNew {
  width: 682px;
  height: 92px;
  background: #6D86C4;
  border-radius: 46px;
  font-size: 28px;
  font-weight: bold;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-red {
  width: 680px;
  height: 90px;
  background: #CD1818;
  border-radius: 45px;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28px;
  font-weight: bold;
  color: #FFFFFF;
}

.btn-blue.disabled {
  opacity: 0.5;
}

button{
  padding: 0;
  margin: 0;
  background: transparent;
}
button::after{
  display: none;
}
.not-bar::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
  // -webkit-overflow-scrolling: touch;
}
.not-bar::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
  background: #c4c4c4;
}

.dot,.omit,.omit-1 {display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;line-clamp: 1;-webkit-line-clamp: 1;}
.dot2,.omit-2 {display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;line-clamp: 2;-webkit-line-clamp: 2;}
.dot3,.omit-3 {display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;line-clamp: 3;-webkit-line-clamp: 3;}
.dot4,.omit-4 {display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;line-clamp: 4;-webkit-line-clamp: 4;}

.box-flex{
  display: flex;
}
.var-more{
  text-align: center;
  color: var(--subT-color);
  font-size: 28px;
  padding: 60px 0;
}
.var-empty{
  padding: 72px 60px;
  text-align: center;
  font-size: 28px;
  color: var(--subT-color);
  .h2{
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 16px;
    color: var(--title-color);
  }
  .p{
    font-size: 24px;
    color: #A6A8AA;
  }
  .image{
    width: 70%;
  }
  .empty-img{
    width: 200px;
  }
  .button{
    background: #d6341e;
    color: #F8F8F8;
    border-radius: 60px;
    margin-top: 60px;
    line-height: 80px;
  }
}
.at-modal__container{
  width: auto!important;
  background: transparent!important;
}
.at-action-sheet__container,.at-action-sheet__body{
  text-align: left!important;
}

.uni-nav-bar{
  display: flex;
  align-items: center;
  position: sticky;
  top:0;
  z-index: 998;
  padding: 0 24px 10px;
  .bar-center{
    width: 500px;
    color: #fff;
    margin: 0 auto;
    text-align: center;
  }
  .bar-right{
    flex-shrink: 0;
  }
}

.flex-cc{
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-cs{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


.hidden {
  display: none;
}

.show {
  display: block;
}

.flex-row {
display: flex;
}

.flex-row-end {
display: flex;
justify-content: flex-end;
}

.flex-row-end-center {
display: flex;
justify-content: flex-end;
align-items: center;
}

.flex-row-center {
display: flex;
justify-content: center;
}

.flex-row--center {
  display: flex;
  align-items: center;
}

.flex-row--end {
display: flex;
align-items: flex-end;
}

.flex-row--baseLine {
display: flex;
align-items: baseline;
}

.flex-row-center-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-row-spaceBetween {
display: flex;
justify-content: space-between;
}

.flex-row-spaceBetween-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-row-spaceAround-center {
display: flex;
justify-content: space-around;
align-items: center;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-column-spaceBetween {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.flex-column-center {
display: flex;
flex-direction: column;
justify-content: center;
}

.flex-column--center {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.flex-column--end {
display: flex;
flex-direction: column;
align-items: flex-end;
}

.flex-column-end {
display: flex;
flex-direction: column;
justify-content: flex-end;
}

.flex-column-end-end {
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-end;
}

.flex-column-center-center {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.txt20 {
  font-size: 20px;
}

.txt22 {
  font-size: 22px;
}

.txt24 {
  font-size: 24px;
}

.txt26 {
  font-size: 26px;
}

.txt28 {
  font-size: 28px;
}

.txt30 {
  font-size: 30px;
}

.txt32 {
  font-size: 32px;
}

.txt34 {
  font-size: 34px;
}

.txt36 {
  font-size: 36px;
}

.txt20 .txt22 .txt24 .txt26 .txt28 .txt30 .txt32 .txt34 .txt36 {
  color: #333333;
}

.black0 {
  color: #000000;
}

.black3 {
  color: #333333;
}

.black6 {
  color: #666666;
}

.black085 {
  color: rgba(0, 0, 0, 0.85);
}

.black05 {
  color: rgba(0, 0, 0, 0.5);
}

.white {
  color: #ffffff;
}

.gray {
  color: #999999;
}

.grayC {
  color: #cccccc;
}

.blue {
  color: #6D86C4;
}

.red {
  color: #cd1818;
}

.bold {
  font-weight: bold;
}

.txtDot {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.txtDotMultiLine {
  overflow: hidden;  //超出文本隐藏
  text-overflow: ellipsis;  ///超出部分省略号显示
  display: -webkit-box;  //弹性盒模型
  -webkit-box-orient: vertical;  //上下垂直
  &.line2 {
    -webkit-line-clamp: 2;  //自定义行数
    line-clamp: 2;
  }
  &.line4 {
    -webkit-line-clamp: 4;
    line-clamp: 4;
  }
}

.font-DIN{
  font-family: 'DINfont';
}